<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>EaglesTroop</title>
	<link rel="stylesheet" href="css/style.css">
	<link rel="stylesheet" href="css/leaders.css">
</head>
<body>
	<!-- 头部，导航栏，logo等 -->
	<div class="header">
		<div class="header-inner">
			<div class="header-left">
				<a class="logo" href="#"></a>
				<div class="title"></div>
			</div>
			<div class="navbar">
				<a href="#" class="navone">Foundation</a>
				<a href="#" class="navtwo">Program</a>
				<a href="#" class="navthree">Leaders</a>
				<a href="#" class="navfour">Gallery</a>
				<a href="#" class="navfive">Contacts</a> 
        		<a href="#" class="navsix ">About</a>
            </div>
		</div>
	</div>
	<!-- 主体部分，分为左右块。可用sidebar名 -->
	<div class="content">
		<div class="content-inner">
			<div class="content-top"> <!-- 主体部分的上半部分，三张图片 -->
				<div class="pic picjoin">
					<div class="morew"><a href="#">more</a></div>
				</div>
				<div class="pic picspr">
					<div class="morew"><a href="">more</a></div>
				</div>
				<div class="pic picsum">
					<div class="morew"><a href="">more</a></div>
				</div>
			</div>
			<div class="content-left"><!-- 主体部分的左边部分，定义为content-left -->
			    <div class="con-left-title">Chairman's Corner</div>
			    <img src="images/Leaders_onepic.png" alt="">
				<div class="textone"> 
					Lorem ipsum dolor sit amet,consetetr sadipscing elitr sed diam nonumy eirmod tempor invidunt ut labore magna aliquyam erat,sed diam voluptua.At vero sos et accusam et justo duo dolores et ea rebum.Stet clita kasd gubergren,no sea takimata sanctus ipsum dolor sit amet.
					Stet clita kasd gubergren,no sea takimata sanctus est Lorem ipsum dolor sit amet 
				</div>
				<a class="more moretwo" href="#"></a>
				<div class="con-left-bottom">
					<div class="con-left-b-title">
						Scoutmasters Minute
					</div>
                    <div class="texttwo">
					<p><span>Lorem ipsum dolor sit amet,consetetr sadipscing elitr</span> sed diam nonumy eirmod tempor invidunt ut labore magna aliquyam erat,sed diam voluptua.At vero sos et accusam et justo duo dolores et ea rebum.Stet clita kasd gubergren,no sea takimata sanctus ipsum dolor sit amet.</p>
                    </div>
                    <img src="images/Leaders_twopic.png" alt="">
                    <ul class="con-left-list" >
                    	<li><a href="#">Lorem ipusm dolor sit amet consetetur</a></li>
                    	<li><a href="#">Sadipscing eliter sed diam nounumy eirmod tempor</a></li>
                    	<li><a href="#">Invidunt ut labore et dolore magna aliquyam</a></li>
                    	<li><a href="#">At vero eos et accusam et justo duo dolors et ea</a></li>
                    	<li><a href="#">Stet clita kasd gubergren no sea takimata</a></li>
                    </ul>
                    <div class="textthree">
                    	At vero sos et accusam et justo duo dolores et ea rebum.Stet clita kasd gubergren,no sea takimata sanctus ipsum dolor sit amet.sed diam nonumy eirmod tempor invidunt ut labore magna aliquyam.
                    </div>
                	<a href="#" class="more morethree"></a>
                </div>
			</div>
			<div class="sidebar"><!-- 主体部分的右半边部分，定义名字为sidebar -->
				<div class="our">
					<span class="sidebar-title">
						Honor Roll
					</span>
				</div>
                <div class="textfour">
                	justo duo dolores et ea rebum.Stet clita kasd gubergren,no sea takimata sanctus ipsum dolor sit amet.
                    Stet clita kasd gubergren,no sea takimata sanctus est Lorem ipsum dolor sit amet lorem ipsum dolor sit amet.
                </div>
				<ul class="sidebar-list">
					<li><a href="#">At vero eos et accusam et justo duo</a></li>
					<li><a href="#">Lorem ipsum dolor sit amet</a></li>
					<li><a href="#">Consetetur sadlipscing elitr sed diam</a></li>
					<li><a href="#">Nonumy eirmod tempor invidunt ut</a></li>
					<li><a href="#">Labore et dolore magna</a></li>
					<li><a href="#">Aliquyam erat sed diam voluptua</a></li>
					<li><a href="#">Vero eos et accusam et justo duo</a></li>
					<li><a href="#">Stet clite kasd gubergren</a></li>
				</ul>
				<a href="#" class="more morefour"></a>
				<div class="our">
					<span class="sidebar-title">
						Youth Leaders
					</span>
				</div>
				<div class="textfive">
					At vero sos et accusam et justo duo dolores et ea rebum.Stet clita kasd gubergren,no sea takimata sanctus ipsum dolor sit amet.Labore et dolore magna 
				</div>
			</div>
		</div>
	</div>
	<!-- 最后的版权等等 -->
	<div class="footer">
		<div class="copyright">
			<span class="eag">
				<p>Eagles Troops © 2012</p>
				<p><a href="#">Website Template</a>by TemplateMonster.com</p>
			</span>
		</div>
		<div class="tubiao">
			<a class="icon iconone" href="#"></a>
			<a class="icon icontwo" href="#"></a>
			<a class="icon iconthree" href="#"></a>
			<a class="icon iconfour" href="#"></a>
		</div>		
	</div>
</body>
</html>